{{Extend "layout"}}
{{Block "title"}}{{if HasSuffix URL.Path "_add"}}{{"添加客户"|T}}{{else}}{{"修改客户"|T}}{{end}}{{/Block}}
{{Block "breadcrumb"}}
{{Super}}
<li><a href="__BACKEND__/official/customer_index">{{"客户管理"|T}}</a></li>
<li class="active">{{if HasSuffix URL.Path "_add"}}{{"添加"|T}}{{else}}{{"修改"|T}}{{end}}</li>
{{/Block}}
{{Block "head"}}
<link rel="stylesheet" href="__ASSETS__/js/jquery.crop/css/jquery.Jcrop.min.css?t={{BuildTime}}" type="text/css" />
<link rel="stylesheet" href="__ASSETS__/js/selectpage/selectpage.css?t={{BuildTime}}" type="text/css" />
{{/Block}}
{{Block "main"}}
{{$addMode := HasSuffix URL.Path "_add"}}
<div class="row">
    <div class="col-md-12">
        <div class="block-flat">
          <div class="header">							
            <h3>{{if $addMode}}{{"添加客户"|T}}{{else}}{{"修改客户"|T}}{{end}}</h3>
          </div>
          <div class="content">
              <form class="form-horizontal group-border-dashed" method="POST" action="" id="customer-profile-form">
              <div class="form-group">
                  <label class="col-sm-2 control-label">{{"头像"|T}}</label>
                  <div class="col-sm-3">
                    <div class="avatar-upload">
                      <a class="label label-danger pull-right avatar-remove" href="javascript:;" title="{{"删除图片"|T}}"><i class="fa fa-times"></i></a>
                      {{$avatar := Form "avatar"}}
                      <img src="{{if $avatar}}{{AddSuffix $avatar "_200_200"}}{{else}}__ASSETS__/images/user_128.png{{end}}" class="profile-avatar img-thumbnail" onerror="this.src='__ASSETS__/images/user_128.png';" />
                      <input id="fileupload" type="file" name="files[]">
                      <input type="hidden" id="avatar-image" name="avatar-small" value="{{if $avatar}}{{AddSuffix $avatar "_200_200"}}{{end}}" />
                      <input type="hidden" id="avatar-image-original" name="avatar" value="{{$avatar}}" />
                      <div id="progress" class="overlay"></div>
                    </div>
                  </div>
                  {{if not $addMode}}
                  <label class="col-sm-2 control-label">{{"客户ID"|T}}</label>
                  <div class="col-sm-3"><span class="form-control no-border">{{Form "id"}}</span></div>
                  {{end}}
                </div>
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"登录名称"|T}}</label>
                <div class="col-sm-3">
                {{if $addMode}}
                  <input type="text" class="form-control" name="name" value="{{Form "name"}}" required />
                {{else}}
                  <span class="form-control no-border">
                    {{Form "name"}}
                  </span>
                {{end}}
                </div>
                <label class="col-sm-2 control-label">{{"真实姓名"|T}}</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" name="realName" value="{{Form "realName"}}" />
                </div>
              </div>
              {{if HasSuffix URL.Path "_add"}}
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"登录密码"|T}}</label>
                <div class="col-sm-3">
                    <input type="password" class="form-control" id="password" name="password" value="{{Form "password"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="密码不可为空" parsley-minlength="6" parsley-minlength-message="密码位数不可少于6位" />
                </div>
                <label class="col-sm-2 control-label">{{"登录密码确认"|T}}</label>
                <div class="col-sm-3">
                    <input type="password" class="form-control" name="password2" value="{{Form "password2"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="确认密码不可为空" parsley-equalto="#password" parsley-equalto-message="两次密码输入不一致" />
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"安全密码"|T}}</label>
                <div class="col-sm-3">
                    <input type="password" class="form-control" id="safePwd" name="safePwd" value="{{Form "safePwd"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="密码不可为空" parsley-minlength="6" parsley-minlength-message="密码位数不可少于6位" />
                </div>
                <label class="col-sm-2 control-label">{{"安全密码确认"|T}}</label>
                <div class="col-sm-3">
                    <input type="password" class="form-control" name="safePwd2" value="{{Form "safePwd2"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="确认密码不可为空" parsley-equalto="#safePwd" parsley-equalto-message="两次密码输入不一致" />
                </div>
              </div>
              {{else}}
              <div class="form-group" id="form-pwd-ctrl">
                  <label class="col-sm-2 control-label">{{"修改密码"|T}}</label>
                  <div class="col-sm-8">
                    {{$v := Form "modifyPwd"}}
                    <div class="checkbox checkbox-primary checkbox-inline">
                      <input type="checkbox" value="1" name="modifyPwd" id="modifyPwd"{{if eq $v "1"}} checked{{end}} onclick="switchPwdInput(this)"> <label for="modifyPwd">{{"修改登录密码"|T}}</label>
                    </div>
                    {{$v := Form "modifySafePwd"}}
                    <div class="checkbox checkbox-primary checkbox-inline">
                      <input type="checkbox" value="1" name="modifySafePwd" id="modifySafePwd"{{if eq $v "1"}} checked{{end}} onclick="switchSafePwdInput(this)"> <label for="modifySafePwd">{{"修改安全密码"|T}}</label>
                    </div>
                  </div>
              </div>
<script type="text/template" id="tpl-input-pwd">
  <div class="form-group" id="form-group-pwd">
    <label class="col-sm-2 control-label">{{"登录密码"|T}}</label>
    <div class="col-sm-3">
        <input type="password" class="form-control" id="password" name="password" value="{{Form "password"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="密码不可为空" parsley-minlength="6" parsley-minlength-message="密码位数不可少于6位" />
    </div>
    <label class="col-sm-2 control-label">{{"登录密码确认"|T}}</label>
    <div class="col-sm-3">
        <input type="password" class="form-control" name="password2" value="{{Form "password2"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="确认密码不可为空" parsley-equalto="#password" parsley-equalto-message="两次密码输入不一致" />
    </div>
  </div>
</script>
<script type="text/template" id="tpl-input-safepwd">
  <div class="form-group" id="form-group-safepwd">
    <label class="col-sm-2 control-label">{{"安全密码"|T}}</label>
    <div class="col-sm-3">
        <input type="password" class="form-control" id="safePwd" name="safePwd" value="{{Form "safePwd"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="密码不可为空" parsley-minlength="6" parsley-minlength-message="密码位数不可少于6位" />
    </div>
    <label class="col-sm-2 control-label">{{"安全密码确认"|T}}</label>
    <div class="col-sm-3">
        <input type="password" class="form-control" name="safePwd2" value="{{Form "safePwd2"}}" required parsley-required="true" parsley-trigger="focusout" parsley-required-message="确认密码不可为空" parsley-equalto="#safePwd" parsley-equalto-message="两次密码输入不一致" />
    </div>
  </div>
</script>
              {{end}}
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"手机号码"|T}}</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" name="mobile" value="{{Form "mobile"}}" />
                </div>
                <label class="col-sm-2 control-label">{{"电邮地址"|T}}</label>
                <div class="col-sm-3">
                    <input type="email" class="form-control" name="email" value="{{Form "email"}}" required />
                </div>
              </div>
              <div class="form-group">
                  <label class="col-sm-2 control-label">{{"性别"|T}}</label>
                  <div class="col-sm-3">
                    {{$v := Form "gendar"}}
                    <div class="radio radio-primary radio-inline">
                      <input type="radio" value="secret" name="gendar" id="gendar-secret"{{if or (eq $v "secret") (eq $v "")}} checked{{end}}> <label for="gendar-secret">{{"保密"|T}}</label>
                    </div>
                    <div class="radio radio-primary radio-inline">
                      <input type="radio" value="female" name="gendar" id="gendar-female"{{if eq $v "female"}} checked{{end}}> <label for="gendar-female">{{"女"|T}}</label>
                    </div>
                    <div class="radio radio-primary radio-inline">
                      <input type="radio" value="male" name="gendar" id="gendar-male"{{if eq $v "male"}} checked{{end}}> <label for="gendar-male">{{"男"|T}}</label>
                    </div>
                  </div>
                <label class="col-sm-2 control-label">{{"身份证号码"|T}}</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" name="idCardNo" value="{{Form "idCardNo"}}" />
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"说明"|T}}</label>
                <div class="col-sm-8">
                  <textarea class="form-control" id="inputDescription" name="description" parsley-trigger="keyup" parsley-maxlength="255" parsley-validation-threshold="10" maxlength="200">{{Form "description"}}</textarea>
                  <small id="descriptionHelp" class="form-text text-muted">{{T "不得超过%d个字,还能输入%s个字" 200 `<code id="descriptionWordsCount">200</code>` | ToHTML}}</small>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"关联后台用户"|T}}</label>
                <div class="col-sm-8">
                  {{$uid := (Formx "uid").Uint64}}
                  <input type="text" name="uid" id="uid"{{if gt $uid 0}} data-init="{{$uid}}"{{end}} value="{{$uid}}" class="form-control">
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-2 control-label">{{"状态"|T}}</label>
                <div class="col-sm-8">
                  {{$v := Form "disabled"}}
                  <div class="radio radio-primary radio-inline"> 
                    <input type="radio" value="N" id="disabled-N" name="disabled"{{if or (eq $v "N") (eq $v "")}} checked{{end}}><label for="disabled-N">{{"启用"|T}}</label> 
                  </div>
                  <div class="radio radio-danger radio-inline"> 
                    <input type="radio" value="Y" id="disabled-Y" name="disabled"{{if eq $v "Y"}} checked{{end}}><label for="disabled-Y">{{"禁用"|T}}</label> 
                  </div>
                </div>
              </div>
              <div class="form-group form-submit-group">
									<div class="col-sm-9 col-sm-offset-2">
									  <button type="submit" class="btn btn-primary btn-lg"><i class="fa fa-save"></i> {{"保存"|T}}</button>
									  <button type="reset" class="btn btn-default btn-lg"><i class="fa fa-refresh"></i> {{"重置"|T}}</button>
									</div>
							</div>
            </form>
            {{Include "modal_crop_image"}}
          </div><!-- /.content -->
        </div><!-- /.block-flat -->
    </div>
</div>
{{/Block}}
{{Block "footer"}}
<script src="__ASSETS__/js/selectpage/selectpage.min.js" type="text/javascript"></script>
<script src="__ASSETS__/js/jquery.upload/js/vendor/jquery.ui.widget.js?t={{BuildTime}}"></script>
<script type="text/javascript" src="__ASSETS__/js/jquery.crop/js/jquery.Jcrop.js?t={{BuildTime}}"></script>
<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
<script src="__ASSETS__/js/jquery.upload/js/jquery.iframe-transport.js?t={{BuildTime}}"></script>
<!-- The basic File Upload plugin -->
<script src="__ASSETS__/js/jquery.upload/js/jquery.fileupload.js?t={{BuildTime}}"></script>
{{if not (HasSuffix URL.Path "_add")}}
<script type="text/javascript">
function switchPwdInput(a){
  if($(a).prop('checked')){
    var t=$('#tpl-input-pwd').html();
    $('#form-pwd-ctrl').after(t);
  }else{
    $('#form-group-pwd').remove();
  }
}
function switchSafePwdInput(a){
  if($(a).prop('checked')){
    var t=$('#tpl-input-safepwd').html();
    var s=$('#form-group-pwd');
    if(s.length>0){
      s.after(t);
    }else{
      $('#form-pwd-ctrl').after(t);
    }
  }else{
    $('#form-group-safepwd').remove();
  }
}
$(function(){
  switchPwdInput($('#modifyPwd')[0]);
  switchSafePwdInput($('#modifySafePwd')[0]);
});
</script>
{{end}}
{{$unixtime:=Now.Unix}}
<script type="text/javascript">
$(function(){
  cropImage(BACKEND_URL+'/manager/upload/customer-avatar?customerId={{Form "id"}}&time={{$unixtime}}&token={{Token "customerId" ((Formx "id").Uint64) "time" $unixtime}}',"#avatar-image",'#avatar-image-original');
  $('#uid').selectPage({
    showField : 'username',
    keyField : 'id',
    data : BACKEND_URL+'/manager/user',
    params : function(){return {};},
    eAjaxSuccess : function(d){
        var result;
        if(d) result = {
          "list":d.Data.listData,
          "pageSize": d.Data.pagination.limit,
          "pageNumber": d.Data.pagination.page,
          "totalRow": d.Data.pagination.rows,
          "totalPage":d.Data.pagination.pages
        };
        else result = undefined;
        return result;
    }
  });
  $('#inputDescription').on('keyup',function(){
    $('#descriptionWordsCount').text(200-String($(this).val()).length);
  }).trigger('keyup');
});
</script>
{{/Block}}